<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0,
    maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"
    />
    <title>订花乐商品详情页</title>
    <link rel="shortcut icon" href="bitbug_favicon.ico" />
    <link rel="stylesheet" href="font/font_3946089_8gayxqrj2hr/iconfont.css" />
    <link rel="stylesheet" href="./css/details.min.css" />
  </head>
  <body>
    <!-- 头部 -->
    <header>
      <div class="nav">
        <a href="#"><span class="iconfont">&#xe8b5;</span></a>
        <div class="logo">
          <img src="./images/detail -img/logo.png" alt="" />
        </div>
        <a href="#"><i class="iconfont">&#xe664;</i></a>
      </div>
    </header>
    <!-- 主体 -->
    <main>
      <!-- banner部分 -->
      <div class="banner">
        <img src="./images/detail -img/flowers-1.png" alt="" />
        <div class="banner-info">
          <p>浪漫满屋</p>
          <div class="banner-info-about">
            <div class="new-price">
              <span>￥299</span>
              <span>￥289</span>
            </div>
            <div class="sell">已售17229笔</div>
          </div>
        </div>
      </div>
      <!-- 产品的介绍 -->
      <div class="introduce">
        <div class="material">材料</div>
        <div class="material-info">19枝红玫瑰，火龙珠，银叶菊绿叶搭配</div>
      </div>
      <div class="introduce">
        <div class="material">包装</div>
        <div class="material-info">黑色韩式包装</div>
      </div>
      <div class="introduce">
        <div class="material">配送</div>
        <div class="material-info">全国送货上门，市区免运费</div>
      </div>
      <div class="introduce">
        <div class="material">附送</div>
        <div class="order">下单填写留言，免费赠送贺卡</div>
      </div>
      <!-- 数量部分 -->
      <div class="quantity">
        <div class="quantity-bg">
          <div class="quantity-font">数量</div>
          <div class="button">
            <div class="button-fot">-</div>
            <div class="button-fot">1</div>
            <div class="button-fot">+</div>
          </div>
        </div>
      </div>
      <!-- 订单评价 -->
      <div class="evaluation">
        <!-- 订单评价顶部 -->
        <div class="evaluation-new">
          <div class="review">订单评价</div>
          <div class="already">最近已有1330条评论</div>
        </div>
        <!-- 第一个评价 -->
        <div class="evaluation-first">
          <div class="evaluation-first-top">
            <div class="userpic-tel">
              <div class="userpic">
                <img src="./images/detail -img/icon-logo.jpg" alt="" />
              </div>
              <div class="tel">147*****2479</div>
            </div>
            <div class="star">
              <img src="./images/detail -img/start.png" alt="" />
            </div>
          </div>
          <p>一大束玫瑰花，老婆非常喜欢。花也很新鲜，推荐大家买</p>
          <div class="flower-pic">
            <img src="./images/detail -img/flowers-2.png" alt="" />
          </div>
        </div>
        <!-- 第二个评价 -->
        <div class="evaluation-two">
          <div class="evaluation-first-top">
            <div class="userpic-tel">
              <div class="userpic">
                <img src="./images/detail -img/icon-logo.jpg" alt="" />
              </div>
              <div class="tel">181*****2479</div>
            </div>
            <div class="star">
              <img src="./images/detail -img/start.png" alt="" />
            </div>
          </div>
          <p>
            鲜花收到了。物流很快，当天就送到了。鲜花太漂亮了，颜色正，包装精美，闺蜜过生日。送给她很喜欢，物美价廉很满意的一次购物。
          </p>
          <div class="flower-pic">
            <img src="./images/detail -img/flowers-3.png" alt="" />
          </div>
        </div>
        <!-- 查看更多评价 -->
        <a href="#"><div class="more">查看更多评价</div></a>
      </div>
      <!-- 产品详情 -->
      <div class="details">
        <div class="details-font">产品详情</div>
        <div class="details-pic-top">
          <img src="./images/detail -img/detail-2.png" alt="" />
        </div>
        <div class="details-pic-top-two">
          <img src="./images/detail -img/detail-3.png" alt="" />
        </div>
        <div class="details-pic-top-three">
          <img src="./images/detail -img/detail-1.png" alt="" />
        </div>
        <div class="blank"></div>
      </div>
    </main>
    <!-- tarbar 底部部分-->
    <div class="tarbar">
      <a href="#">
        <div class="shouye">
          <img src="./images/detail -img/icon-index.png" alt="" />首页
        </div>
      </a>
      <a href="#">
        <div class="shouye">
          <img src="./images/detail -img/icon-phone.png" alt="" />电话
        </div>
      </a>
      <a href="#">
        <div class="gouwuche">
          <img src="./images/detail -img/icon-car.png" alt="" />购物车
        </div>
      </a>
      <a href="#">加入购物车</a>
      <a href="#">立即购买</a>
    </div>
  </body>
</html>
